<template>
  <div class="incolumn">
    <div class="incolumn_countr">
      <div class="incolumn_second">
        输入搜索：
        <input class="incolumn_ipt" type="text" />
        <span class="incolumn_second1">
          输入时间：
          <input class="incolumn_ipt" type="text" />
        </span>
        <div class="block">
          <el-date-picker
            class="block_Math"
            v-model="value1"
            type="daterange"
            range-separator="————"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          ></el-date-picker>
          <el-button class="btn_sx" type="primary">筛选</el-button>
          <a class="block_text" href>情况筛选条件</a>
          <el-button class="btn_xz" type="danger" @click="Event">新增采购</el-button>
        </div>
      </div>
    </div>
    <!-- ------   第二模块儿表单  ----------- -->
    <div class="incolumn_from">
      <div class="incolumn_text">
        <span class="incolumn_text_cu">新增采购</span>
        <span class="incolumn_text1">
          计划类别
          <input class="incolumn_ipt" type="text" />
        </span>
      </div>
      <p class="incolumn_Division"></p>
      <div class="Literary_text1">
        采购模式
        <input class="Literary_ipt" type="text" />
        <span class="Literary_Horizontal">
          计件数
          <input class="Literary_ipt" type="text" />
        </span>
      </div>
      <div class="Literary_text1">
        采购范围
        <input class="Literary_ipt" type="text" />
        <span class="Literary_Horizontal1">
          交货地点
          <input class="Literary_ipt" type="text" />
        </span>
        <span class="Literary_Horizontal1">
          结算方式
          <input class="Literary_ipt" type="text" />
        </span>
        <span class="Literary_Horizontal1">
          打印次数
          <input class="Literary_ipt" type="text" />
        </span>
      </div>
      <div class="Literary_text1">
        采购方式
        <input class="Literary_ipt" type="text" />
        <span class="Literary_Horizontal1">
          合同方式
          <input class="Literary_ipt" type="text" />
        </span>
        <span class="Literary_Horizontal1">
          结算日期
          <input class="Literary_ipt" type="text" />
        </span>
        <span class="Literary_Horizontal1">
          汇率类型
          <input class="Literary_ipt" type="text" />
        </span>
      </div>
      <div class="Literary_text1">
        供货商
        <input class="Literary_ipt1" type="text" />
        <span class="Literary_Horizontal2">
          编号
          <input class="Literary_ipt" type="text" />
        </span>
        <span class="Literary_Horizontal2">
          摘要
          <input class="Literary_ipt" type="text" />
        </span>
        <span class="Literary_Horizontal3">
          币种
          <input class="Literary_ipt" type="text" />
        </span>
      </div>
      <div class="Literary_text1">
        源单类型
        <input class="Literary_ipt" type="text" />
        <span class="Literary_Horizontal4">
          选单号
          <input class="Literary_ipt" type="text" />
        </span>
        <span class="Literary_Horizontal2">
          日期
          <input class="Literary_ipt" type="text" />
        </span>
        <span class="Literary_Horizontal3">
          汇率
          <input class="Literary_ipt" type="text" />
        </span>
      </div>
      <div class="Literary_text1">
        版本号
        <input class="Literary_ipt1" type="text" />
        <span class="Literary_Horizontal1">
          变更日期
          <input class="Literary_ipt" type="text" />
        </span>
        <span class="Literary_Horizontal4">
          变更人
          <input class="Literary_ipt" type="text" />
        </span>
        <span class="Literary_Horizontal1">
          变更原因
          <input class="Literary_ipt" type="text" />
        </span>
      </div>
      <div class="bottom_ma">
        <div class="bottom_column">
          <span class="column_text">序号</span>
          <span class="column_text1">物料代码</span>
          <span class="column_text2">物料名称</span>
          <span class="column_text2">规格型号</span>
          <span class="column_text2">辅助属性</span>
          <span class="column_text2">单位</span>
          <span class="column_text3">辅助单位</span>
          <span class="column_text3">换算率</span>
          <span class="column_text3">辅助数量</span>
          <span class="column_text4">单价</span>
          <span class="column_text4">含税单价</span>
          <span class="column_text4">金额</span>
          <span class="column_text4">折扣率(%)</span>
          <span class="column_text5">实际含税单价</span>
          <span class="column_text5">折扣额</span>
          <span class="column_text6">税率(%)</span>
        </div>

        <div class="bottom_column_of">
          <span class="text_dato">01</span>
          <input class="column_ipt1" type="text" />
          <input class="column_ipt2" type="text" />
          <input class="column_ipt2" type="text" />
          <input class="column_ipt2" type="text" />
          <input class="column_ipt3" type="text" />
          <input class="column_ipt2" type="text" />
          <input class="column_ipt3" type="text" />
          <input class="column_ipt3" type="text" />
          <input class="column_ipt3" type="text" />
          <input class="column_ipt3" type="text" />
          <input class="column_ipt3" type="text" />
          <input class="column_ipt3" type="text" />
          <input class="column_ipt3" type="text" />
          <input class="column_ipt3" type="text" />
          <input class="column_ipt3" type="text" />
        </div>
      </div>
      <div class="bottom_btn">
        <el-button type="primary">确认</el-button>
        <el-button type="info">返回</el-button>
      </div>
    </div>
  </div>
</template>

<script>
import daohanganniu from "../../components/daoHangAnNiu.vue";
export default {
  components: {
    daohangNav: daohanganniu
  },
  data() {
    return {};
  },
  methods: {
    //新增
  }
};
</script>

<style lang="scss" scoped>
@import "@/assets/scss/base.scss";
//第一块儿
.incolumn_countr {
  margin-left: 15px;
  height: 80px;
  width: 98%;
  background-color: white;
}
.incolumn_ipt {
  width: 15%;
  height: 35px;
  display: inline-block;
  border: none;
  border: 1px solid $linecolor;
  border-radius: 5px;
}
.incolumn_second {
  margin-left: 20px;
  color: $fontcolor;
  line-height: 80px;
}
.incolumn_second1 {
  margin-left: 30px;
}
.btn_sx {
  margin-left: 5px;
}
.btn_xz {
  margin-left: 10%;
}
.block {
  margin-top: -82px;
  margin-left: 48%;
  cursor: pointer;
}
.block_Math {
  cursor: pointer;
}
.block_text {
  font-size: $font-size-small;
  color: $blue;
}

//第二块
.incolumn_from {
  margin-top: 15px;
  margin-left: 15px;
  width: 98%;
  height: 80%;
  background-color: white;
}
.incolumn_text {
  height: 60px;
  margin-left: 30px;
  line-height: 60px;
}
.incolumn_text_cu {
  font-weight: bold;
}
.incolumn_text1 {
  margin-left: 70%;
  font-size: $font-size-small;
}
.incolumn_Division {
  width: 97%;
  margin-left: 15px;
  border: 0.3px solid $linecolor;
}
//第二块表单
.Literary_text1 {
  margin-left: 30px;
  font-size: $font-size-small;
  color: $fontcolor;
  margin-top: 10px;
}
.Literary_ipt {
  margin-left: 10px;
  height: 35px;
  width: 15%;
  border: none;
  border: 1px solid $linecolor;
  border-radius: 5px;
}
.Literary_ipt1 {
  margin-left: 23px;
  height: 35px;
  width: 15%;
  border: none;
  border: 1px solid $linecolor;
  border-radius: 5px;
}
.Literary_Horizontal {
  margin-left: 57%;
}
.Literary_Horizontal1 {
  margin-left: 70px;
  text-align: center;
}
.Literary_Horizontal2 {
  margin-left: 92px;
}
.Literary_Horizontal3 {
  margin-left: 96px;
}
.Literary_Horizontal4 {
  margin-left: 80px;
}

//第三部分
.bottom_ma {
  margin-top: 30px;
  margin-left: 30px;
}
.bottom_column_of {
  margin-left: 20px;
  margin-top: 10px;
}
.text_dato {
  margin-left: -20px;
}
.bottom_text {
  font-size: $font-size-small;
}
.column_text {
  font-size: $font-size-small;
}
.column_text1 {
  font-size: $font-size-small;
  margin-left: 15px;
}
.column_text2 {
  font-size: $font-size-small;
  margin-left: 36px;
}
.column_text3 {
  font-size: $font-size-small;
  margin-left: 37px;
}
.column_text4 {
  font-size: $font-size-small;
  margin-left: 27px;
}
.column_text5 {
  font-size: $font-size-small;
  margin-left: 5px;
}
.column_text6 {
  font-size: $font-size-small;
  margin-left: 27px;
}
.column_ipt {
  width: 15px;
  border-radius: 2px;
  border: none;
  border: 1px solid $linecolor;
}
.column_ipt1 {
  height: 30px;
  width: 80px;
  border-radius: 5px;
  border: none;
  border: 1px solid $linecolor;
  margin-left: 10px;
}
.column_ipt2 {
  height: 30px;
  width: 80px;
  border-radius: 5px;
  border: none;
  border: 1px solid $linecolor;
  margin-left: 3px;
}
.column_ipt3 {
  height: 30px;
  width: 60px;
  border-radius: 5px;
  border: none;
  border: 1px solid $linecolor;
  margin-left: 3px;
}
.bottom_btn {
  margin-left: 38%;
  margin-top: 80px;
}
</style>